JavaScript-suorituskykyregressioiden ehkäisy: automaattinen suorituskykytestaus

Nykypäivän nopeatempoisessa digitaalisessa maailmassa verkkosivustojen ja sovellusten suorituskyky on kriittinen tekijä käyttäjätyytyväisyyden, sitoutumisen ja lopulta liiketoiminnan menestyksen kannalta. Hitaasti latautuva tai reagoimaton sovellus voi johtaa turhautuneisiin käyttäjiin, keskeytettyihin ostoihin ja negatiiviseen vaikutukseen brändisi maineeseen. JavaScript, joka on modernin web-kehityksen ydinkomponentti, on merkittävässä roolissa kokonaissuorituskyvyssä. Siksi suorituskykyregressioiden – odottamattomien suorituskyvyn heikkenemisten – ehkäiseminen on ensisijaisen tärkeää. Tässä automaattinen suorituskykytestaus astuu kuvaan.

Mitä on JavaScript-suorituskykyregressio?

Suorituskykyregressio tapahtuu, kun uusi koodimuutos tai päivitys aiheuttaa heikkenemistä JavaScript-sovelluksen suorituskyvyssä. Tämä voi ilmetä monin eri tavoin, kuten:

• Pidentynyt sivun latausaika: Käyttäjät kokevat pidempiä odotusaikoja ennen kuin sivu on täysin interaktiivinen.
• Hitaampi renderöinti: Visuaalisten elementtien ilmestyminen näytölle kestää kauemmin.
• Alentunut kuvataajuus: Animaatiot ja siirtymät näyttävät nykiviltä ja vähemmän sulavilta.
• Lisääntynyt muistinkulutus: Sovellus käyttää enemmän muistia, mikä voi johtaa kaatumisiin tai hidastumisiin.
• Lisääntynyt suoritinkäyttö: Sovellus kuluttaa enemmän prosessointitehoa, mikä vaikuttaa mobiililaitteiden akunkestoon.

Nämä regressiot voivat olla hienovaraisia ja jäädä helposti huomaamatta manuaalisessa testauksessa, erityisesti monimutkaisissa sovelluksissa, joissa on lukuisia toisiinsa liittyviä komponentteja. Ne saattavat tulla ilmi vasta tuotantoon viemisen jälkeen, vaikuttaen suureen määrään käyttäjiä.

Automaattisen suorituskykytestauksen merkitys

Automaattinen suorituskykytestaus antaa sinun ennakoivasti tunnistaa ja korjata suorituskykyregressioita ennen kuin ne vaikuttavat käyttäjiisi. Se sisältää automatisoitujen skriptien luomisen, jotka mittaavat erilaisia suorituskykymittareita ja vertaavat niitä ennalta määritettyihin kynnysarvoihin tai perustasoihin. Tämä lähestymistapa tarjoaa useita keskeisiä etuja:

• Varhainen havaitseminen: Tunnista suorituskykyongelmat varhaisessa kehitysvaiheessa, estäen niiden pääsyn tuotantoon.
• Johdonmukaisuus ja luotettavuus: Automaattiset testit tuottavat johdonmukaisia ja luotettavia tuloksia, poistaen inhimilliset virheet ja subjektiivisuuden.
• Nopeampi palaute: Saat välitöntä palautetta koodimuutosten suorituskykyvaikutuksista, mikä mahdollistaa nopean iterioinnin ja optimoinnin.
• Alentuneet kustannukset: Korjaa suorituskykyongelmat varhain kehitysprosessissa, mikä vähentää merkittävästi korjaamiseen tarvittavia kustannuksia ja vaivaa.
• Parempi käyttäjäkokemus: Tarjoa jatkuvasti nopea ja reagoiva käyttäjäkokemus, mikä johtaa lisääntyneeseen käyttäjätyytyväisyyteen ja sitoutumiseen.
• Jatkuva seuranta: Integroi suorituskykytestit jatkuvan integraation/jatkuvan toimituksen (CI/CD) putkeen jatkuvaa suorituskyvyn seurantaa varten.

Tärkeimmät seurattavat suorituskykymittarit

Automaattista suorituskykytestausta toteutettaessa on olennaista keskittyä keskeisiin suorituskykymittareihin, jotka vaikuttavat suoraan käyttäjäkokemukseen. Tässä joitakin tärkeimpiä mittareita:

• First Contentful Paint (FCP): Mittaa aikaa, joka kuluu ensimmäisen sisällön (teksti, kuva jne.) ilmestymiseen näytölle.
• Largest Contentful Paint (LCP): Mittaa aikaa, joka kuluu suurimman sisältöelementin ilmestymiseen näytölle.
• First Input Delay (FID): Mittaa aikaa, joka kuluu selaimen reagoimiseen käyttäjän ensimmäiseen vuorovaikutukseen (esim. napin painallus).
• Time to Interactive (TTI): Mittaa aikaa, joka kuluu sivun muuttumiseen täysin interaktiiviseksi ja reagoivaksi käyttäjän syötteelle.
• Total Blocking Time (TBT): Mittaa kokonaisaikaa, jonka pääsäie on estettynä sivun latauksen aikana, estäen selainta reagoimasta käyttäjän syötteelle.
• Cumulative Layout Shift (CLS): Mittaa odottamattomien asettelun siirtymien määrää sivun latauksen aikana, mikä aiheuttaa visuaalista epävakautta.
• JavaScriptin suoritusaika: JavaScript-koodin suorittamiseen käytetty aika.
• Muistin käyttö: Sovelluksen kuluttaman muistin määrä.
• Suorittimen käyttö: Sovelluksen kuluttaman prosessointitehon määrä.
• Verkkopyynnöt: Sovelluksen tekemien verkkopyyntöjen määrä ja koko.

Työkalut ja teknologiat automaattiseen JavaScript-suorituskykytestaukseen

Automaattisen JavaScript-suorituskykytestauksen toteuttamiseen voidaan käyttää useita työkaluja ja teknologioita. Tässä muutamia suosittuja vaihtoehtoja:

• WebPageTest: Ilmainen ja avoimen lähdekoodin työkalu verkkosivuston suorituskyvyn testaamiseen eri sijainneista ja laitteilta. Se tarjoaa yksityiskohtaisia suorituskykyraportteja, mukaan lukien vesiputouskaavioita, filmstrippejä ja Core Web Vitals -mittareita. WebPageTest voidaan automatisoida sen API:n kautta.
• Lighthouse: Googlen kehittämä avoimen lähdekoodin työkalu, joka auditoi verkkosivuja suorituskyvyn, saavutettavuuden, parhaiden käytäntöjen ja SEO:n osalta. Se tarjoaa yksityiskohtaisia suosituksia suorituskyvyn parantamiseksi. Lighthouse voidaan ajaa komentoriviltä, Chrome DevToolsissa tai Node-moduulina.
• PageSpeed Insights: Googlen tarjoama työkalu, joka analysoi verkkosivujesi nopeutta ja antaa suosituksia parannuksista. Se käyttää Lighthousea analyysimoottorinaan.
• Chrome DevTools: Chrome-selaimen sisäänrakennetut kehittäjätyökalut tarjoavat kattavan joukon suorituskyvyn analysointityökaluja, mukaan lukien Performance-, Memory- ja Network-paneelit. Näitä työkaluja voidaan käyttää JavaScript-koodin profilointiin, suorituskyvyn pullonkaulojen tunnistamiseen ja muistinkäytön seurantaan. Chrome DevTools voidaan automatisoida Puppeteerin tai Playwrightin avulla.
• Puppeteer ja Playwright: Node-kirjastoja, jotka tarjoavat korkean tason API:n headless Chrome- tai Firefox-selainten hallintaan. Niitä voidaan käyttää selainvuorovaikutusten automatisointiin, suorituskykymittareiden mittaamiseen ja suorituskykyraporttien luomiseen. Playwright tukee Chromea, Firefoxia ja Safaria.
• Sitespeed.io: Avoimen lähdekoodin työkalu, joka kerää dataa useista web-suorituskykytyökaluista (kuten WebPageTest, Lighthouse ja Browsertime) ja esittää sen yhdellä kojelaudalla.
• Browsertime: Node.js-työkalu, joka mittaa selaimen suorituskykymittareita käyttäen Chromea tai Firefoxia.
• Jest: Suosittu JavaScript-testauskehys, jota voidaan käyttää yksikkö- ja integraatiotestaukseen. Jestiä voidaan käyttää myös suorituskykytestaukseen mittaamalla koodinpätkien suoritusaikaa.
• Mocha ja Chai: Toinen suosittu JavaScript-testauskehys ja väittämäkirjasto. Näitä työkaluja voidaan yhdistää suorituskykytestauskirjastoihin, kuten benchmark.js.
• Suorituskyvyn seurantatyökalut (esim. New Relic, Datadog, Sentry): Nämä työkalut tarjoavat reaaliaikaisia suorituskyvyn seuranta- ja hälytysominaisuuksia, joiden avulla voit havaita ja diagnosoida suorituskykyongelmia tuotannossa.

Automaattisen suorituskykytestauksen toteuttaminen: askel-askeleelta-opas

Tässä on askel-askeleelta-opas automaattisen suorituskykytestauksen toteuttamiseen JavaScript-projekteissasi:

1. Määrittele suorituskykybudjetit

Suorituskykybudjetti on joukko rajoituksia keskeisille suorituskykymittareille, joita sovelluksesi on noudatettava. Nämä budjetit toimivat ohjeina kehittäjille ja tarjoavat selkeän tavoitteen suorituskyvyn optimoinnille. Esimerkkejä suorituskykybudjeteista ovat:

• Sivun latausaika: Tavoittele alle 3 sekunnin latausaikaa.
• First Contentful Paint (FCP): Tähtää alle 1 sekunnin FCP-aikaan.
• JavaScript-paketin koko: Rajoita JavaScript-pakettien koko alle 500 kilotavuun.
• HTTP-pyyntöjen määrä: Vähennä HTTP-pyyntöjen määrä alle 50:een.

Määrittele realistiset ja saavutettavissa olevat suorituskykybudjetit sovelluksesi vaatimusten ja kohdeyleisön perusteella. Ota huomioon tekijöitä, kuten verkkoyhteyden olosuhteet, laitteiden ominaisuudet ja käyttäjien odotukset.

2. Valitse oikeat työkalut

Valitse työkalut ja teknologiat, jotka sopivat parhaiten tarpeisiisi ja budjettiisi. Ota huomioon seuraavia tekijöitä:

• Helppokäyttöisyys: Valitse työkaluja, jotka ovat helppoja oppia ja käyttää, joilla on selkeä dokumentaatio ja tukeva yhteisö.
• Integrointi olemassa oleviin työnkulkuihin: Valitse työkaluja, jotka integroituvat saumattomasti olemassa oleviin kehitys- ja testaustyönkulkuihisi.
• Kustannukset: Harkitse työkalujen kustannuksia, mukaan lukien lisenssimaksut ja infrastruktuurikulut.
• Ominaisuudet: Valitse työkaluja, jotka tarjoavat tarvitsemasi ominaisuudet, kuten suorituskyvyn profiloinnin, raportoinnin ja hälytykset.

Aloita pienellä joukolla työkaluja ja laajenna työkalupakkiasi vähitellen tarpeidesi kehittyessä.

3. Luo suorituskykytestiskriptejä

Kirjoita automatisoituja testiskriptejä, jotka mittaavat sovelluksesi kriittisten käyttäjäpolkujen ja komponenttien suorituskykyä. Näiden skriptien tulisi simuloida todellisia käyttäjävuorovaikutuksia ja mitata keskeisiä suorituskykymittareita.

Esimerkki Puppeteerin käytöstä sivun latausajan mittaamiseen:

const puppeteer = require('puppeteer');

(async () => {
 const browser = await puppeteer.launch();
 const page = await browser.newPage();
 const url = 'https://www.example.com';

 const navigationPromise = page.waitForNavigation({waitUntil: 'networkidle0'});
 await page.goto(url);
 await navigationPromise;

 const metrics = await page.metrics();

 console.log(`Page load time for ${url}: ${metrics.timestamps.loadEventEnd - metrics.timestamps.navigationStart}ms`);

 await browser.close();
})();

Tämä skripti käyttää Puppeteeria käynnistämään headless Chrome-selaimen, navigoimaan määritettyyn URL-osoitteeseen, odottamaan sivun latautumista ja mittaamaan sitten sivun latausajan. `networkidle0`-vaihtoehto `waitForNavigation`-kutsussa varmistaa, että selain odottaa, kunnes verkkoyhteyksiä ei ole ollut vähintään 500 ms:aan, ennen kuin se katsoo sivun ladatuksi.

Toinen esimerkki, joka käyttää Browsertimea ja Sitespeed.io:ta ja keskittyy Core Web Vitals -mittareihin:

// Asenna tarvittavat paketit:
// npm install -g browsertime sitespeed.io

// Aja testi (esimerkki komentorivikäytöstä):
// sitespeed.io https://www.example.com --browsertime.iterations 3 --browsertime.xvfb

// Tämä komento:
// 1. Ajaa Browsertimen 3 kertaa määritettyä URL-osoitetta vastaan.
// 2. Käyttää virtuaalista X-palvelinta (xvfb) headless-testaukseen.
// 3. Sitespeed.io kokoaa tulokset ja tarjoaa raportin, joka sisältää Core Web Vitals -mittarit.

// Raportti näyttää LCP:n, FID:n, CLS:n ja muita suorituskykymittareita.

Tämä esimerkki näyttää, kuinka Sitespeed.io ja Browsertime asetetaan ajamaan automaattisia suorituskykytestejä ja noutamaan Core Web Vitals -mittarit. Komentorivivalinnat ovat spesifisiä browsertime-testin ajamiselle sitespeed.io:lla.

4. Integroi suorituskykytestit CI/CD-putkeesi

Integroi suorituskykytestisi CI/CD-putkeesi, jotta ne ajetaan automaattisesti aina, kun koodimuutoksia tehdään. Tämä varmistaa, että suorituskykyä seurataan jatkuvasti ja että regressiot havaitaan varhaisessa vaiheessa.

Useimmat CI/CD-alustat, kuten Jenkins, GitLab CI, GitHub Actions ja CircleCI, tarjoavat mekanismeja automatisoitujen testien ajamiseen osana koontiprosessia. Määritä CI/CD-putkesi ajamaan suorituskykytestiskriptisi ja epäonnistumaan koontivaiheessa, jos jokin suorituskykybudjeteista ylittyy.

Esimerkki GitHub Actionsin käytöstä:

name: Performance Tests

on:
 push:
 branches: [ main ]
 pull_request:
 branches: [ main ]

jobs:
 performance:
 runs-on: ubuntu-latest
 steps:
 - uses: actions/checkout@v2
 - name: Set up Node.js
 uses: actions/setup-node@v2
 with:
 node-version: '16'
 - name: Install dependencies
 run: npm install
 - name: Run performance tests
 run: npm run performance-test
 env:
 PERFORMANCE_BUDGET_PAGE_LOAD_TIME: 3000 # millisekuntia

Tämä GitHub Actions -työnkulku määrittelee "performance"-nimisen työn, joka ajetaan Ubuntulla. Se hakee koodin, asentaa Node.js:n, asentaa riippuvuudet ja ajaa sitten suorituskykytestit `npm run performance-test` -komennolla. `PERFORMANCE_BUDGET_PAGE_LOAD_TIME` -ympäristömuuttuja määrittelee suorituskykybudjetin sivun latausajalle. `npm run performance-test` -skripti sisältäisi tarvittavat komennot suorituskykytestien suorittamiseen (esim. Puppeteerilla, Lighthousella tai WebPageTestillä). `package.json`-tiedostosi tulisi sisältää `performance-test`-skriptin, joka suorittaa testit ja tarkistaa tulokset määriteltyjä budjetteja vastaan, ja poistuu nollasta poikkeavalla poistumiskoodilla, jos budjetit rikotaan, mikä aiheuttaa CI-koonnin epäonnistumisen.

5. Analysoi ja raportoi suorituskykytulokset

Analysoi suorituskykytestiesi tuloksia tunnistaaksesi parannuskohteita. Luo raportteja, jotka tiivistävät suorituskykymittarit ja korostavat mahdollisia regressioita tai suorituskykybudjettien rikkomuksia.

Useimmat suorituskykytestaustyökalut tarjoavat sisäänrakennettuja raportointiominaisuuksia. Käytä näitä raportteja seurataksesi suorituskyvyn trendejä ajan myötä ja tunnistaaksesi malleja, jotka voivat viitata taustalla oleviin suorituskykyongelmiin.

Esimerkki suorituskykyraportista (yksinkertaistettu):

Suorituskykyraportti:

URL: https://www.example.com

Mittarit:
 First Contentful Paint (FCP): 0.8s (HYVÄKSYTTY)
 Largest Contentful Paint (LCP): 2.2s (HYVÄKSYTTY)
 Time to Interactive (TTI): 2.8s (HYVÄKSYTTY)
 Total Blocking Time (TBT): 150ms (HYVÄKSYTTY)
 Sivun latausaika: 2.9s (HYVÄKSYTTY) - Budjetti: 3.0s

JavaScript-paketin koko: 480KB (HYVÄKSYTTY) - Budjetti: 500KB

Suorituskykyregressioita ei havaittu.

Tämä raportti tiivistää tietyn URL-osoitteen suorituskykymittarit ja osoittaa, läpäisevätkö ne vai eivät määriteltyjen suorituskykybudjettien perusteella. Se myös mainitsee, havaittiinko suorituskykyregressioita. Tällainen raportti voidaan luoda testiskripteissäsi ja lisätä CI/CD-ulostuloon.

6. Iteroi ja optimoi

Suorituskykytulosten analyysin perusteella tunnista optimointikohteet ja iteroi koodiasi suorituskyvyn parantamiseksi. Yleisiä optimointitekniikoita ovat:

• Koodin jakaminen (Code Splitting): Jaa suuret JavaScript-paketit pienempiin, paremmin hallittaviin osiin, jotka voidaan ladata tarvittaessa.
• Laiska lataus (Lazy Loading): Lykkää ei-kriittisten resurssien lataamista, kunnes niitä tarvitaan.
• Kuvien optimointi: Optimoi kuvia pakkaamalla ne, muuttamalla niiden kokoa sopiviin mittoihin ja käyttämällä moderneja kuvamuotoja, kuten WebP.
• Välimuisti (Caching): Hyödynnä selaimen välimuistia verkkopyyntöjen määrän vähentämiseksi.
• Minifiointi ja uglifiointi: Pienennä JavaScript- ja CSS-tiedostojesi kokoa poistamalla tarpeettomat merkit ja välilyönnit.
• Debouncing ja Throttling: Rajoita laskennallisesti kalliiden operaatioiden suoritustiheyttä, jotka käyttäjän tapahtumat laukaisevat.
• Tehokkaiden algoritmien ja tietorakenteiden käyttö: Valitse tehokkaimmat algoritmit ja tietorakenteet omiin käyttötapauksiisi.
• Muistivuotojen välttäminen: Varmista, että koodisi vapauttaa muistin oikein, kun sitä ei enää tarvita.
• Kolmansien osapuolien kirjastojen optimointi: Arvioi kolmansien osapuolien kirjastojen suorituskykyvaikutusta ja valitse tarvittaessa vaihtoehtoja. Harkitse kolmansien osapuolien skriptien laiskaa lataamista.

Seuraa jatkuvasti sovelluksesi suorituskykyä ja toista testaus- ja optimointiprosessia tarpeen mukaan.

Parhaat käytännöt JavaScript-suorituskykytestauksessa

Tässä on joitakin parhaita käytäntöjä, joita noudattaa automaattisen JavaScript-suorituskykytestauksen toteuttamisessa:

• Testaa realistisessa ympäristössä: Aja suorituskykytestisi ympäristössä, joka muistuttaa mahdollisimman paljon tuotantoympäristöäsi. Tämä sisältää tekijöitä, kuten verkkoyhteyden olosuhteet, laitteiden ominaisuudet ja palvelimen kokoonpanon.
• Käytä johdonmukaista testausmetodologiaa: Käytä johdonmukaista testausmenetelmää varmistaaksesi, että tuloksesi ovat vertailukelpoisia ajan myötä. Tämä sisältää tekijöitä, kuten iteraatioiden määrän, lämmittelyjakson ja mittausvälin.
• Seuraa suorituskykyä tuotannossa: Käytä suorituskyvyn seurantatyökaluja seurataksesi jatkuvasti sovelluksesi suorituskykyä tuotannossa. Tämä antaa sinun havaita ja diagnosoida suorituskykyongelmia, jotka eivät välttämättä tule esiin testauksessa.
• Automatisoi kaikki mahdollinen: Automatisoi niin suuri osa suorituskykytestausprosessista kuin mahdollista, mukaan lukien testien suoritus, tulosten analysointi ja raporttien luominen.
• Pidä testit ajan tasalla: Päivitä suorituskykytestisi aina, kun koodiin tehdään muutoksia. Tämä varmistaa, että testisi ovat aina relevantteja ja että ne heijastavat tarkasti sovelluksesi suorituskykyä.
• Ota koko tiimi mukaan: Ota koko kehitystiimi mukaan suorituskykytestausprosessiin. Tämä auttaa lisäämään tietoisuutta suorituskykyongelmista ja edistämään suorituskyvyn optimointikulttuuria.
• Aseta hälytyksiä: Määritä hälytyksiä ilmoittamaan sinulle, kun suorituskykyregressioita havaitaan. Tämä antaa sinun reagoida nopeasti suorituskykyongelmiin ja estää niitä vaikuttamasta käyttäjiisi.
• Dokumentoi testisi ja prosessisi: Dokumentoi suorituskykytestisi, suorituskykybudjettisi ja testausprosessisi. Tämä auttaa varmistamaan, että kaikki tiimin jäsenet ymmärtävät, miten suorituskykyä mitataan ja seurataan.

Yleisten haasteiden käsittely

Vaikka automaattinen suorituskykytestaus tarjoaa lukuisia etuja, se tuo mukanaan myös joitakin haasteita. Tässä on tapoja käsitellä joitakin yleisiä esteitä:

• Epävakaat testit (Flaky Tests): Suorituskykytestit voivat joskus olla epävakaita, mikä tarkoittaa, että ne voivat läpäistä tai epäonnistua satunnaisesti hallintasi ulkopuolella olevista tekijöistä, kuten verkon ruuhkautumisesta tai palvelimen kuormituksesta johtuen. Tämän lieventämiseksi aja testit useita kertoja ja laske tulosten keskiarvo. Voit myös käyttää tilastollisia tekniikoita poikkeamien tunnistamiseen ja suodattamiseen.
• Testiskriptien ylläpito: Sovelluksesi kehittyessä suorituskykytestiskriptejäsi on päivitettävä vastaamaan muutoksia. Tämä voi olla aikaa vievä ja virhealtis prosessi. Tämän ratkaisemiseksi käytä modulaarista ja ylläpidettävää testausarkkitehtuuria ja harkitse testiautomaatiotyökalujen käyttöä, jotka voivat automaattisesti luoda ja päivittää testiskriptejä.
• Tulosten tulkinta: Suorituskykytestien tulokset voivat olla monimutkaisia ja vaikeita tulkita. Tämän ratkaisemiseksi käytä selkeitä ja ytimekkäitä raportointi- ja visualisointityökaluja. Voi myös olla hyödyllistä määrittää suorituskyvyn perustaso ja verrata myöhempiä testituloksia siihen.
• Kolmansien osapuolien palveluiden käsittely: Sovelluksesi voi olla riippuvainen kolmansien osapuolien palveluista, jotka ovat hallintasi ulkopuolella. Näiden palveluiden suorituskyky voi vaikuttaa sovelluksesi kokonaissuorituskykyyn. Tämän ratkaisemiseksi seuraa näiden palveluiden suorituskykyä ja harkitse mock- tai stub-tekniikoiden käyttöä sovelluksesi eristämiseksi suorituskykytestauksen aikana.

Yhteenveto

Automaattinen JavaScript-suorituskykytestaus on elintärkeä käytäntö jatkuvasti nopean ja tehokkaan käyttäjäkokemuksen varmistamiseksi. Toteuttamalla automaattisia testejä voit ennakoivasti tunnistaa ja korjata suorituskykyregressioita, vähentää kehityskustannuksia ja toimittaa korkealaatuisen tuotteen. Valitse oikeat työkalut, määrittele selkeät suorituskykybudjetit, integroi testit CI/CD-putkeesi ja seuraa ja optimoi jatkuvasti sovelluksesi suorituskykyä. Omaksumalla nämä käytännöt voit luoda JavaScript-sovelluksia, jotka eivät ole vain toimivia vaan myös suorituskykyisiä, ilahduttaen käyttäjiäsi ja edistäen liiketoiminnan menestystä.

Muista, että suorituskyky on jatkuva prosessi, ei kertaluonteinen korjaus. Seuraa, testaa ja optimoi jatkuvasti JavaScript-koodiasi tarjotaksesi parhaan mahdollisen kokemuksen käyttäjillesi, olivatpa he missä päin maailmaa tahansa.

Lisäresurssit

• Web Vitals
• Lighthouse
• WebPageTest
• Sitespeed.io
• Puppeteer
• Playwright